import { nanoid } from 'nanoid';
import React from 'react'
import './index.css'
export default function Header({setTodoList,todoList}) {   
    
    const getInputValue = (e)=>{
        if (e.keyCode != 13) return;
        const InputValue = e.target.value.trim()
        if(!InputValue){
            return alert('请输入正确内容，内容不能为空！！！')
        }
        setTodoList([{id:nanoid(),todo:InputValue,done:false},...todoList] )
        e.target.value = null
    }
    return (
        <div>
            <div className="todo-header">
                <input type="text" placeholder="请输入你的任务名称，按回车键确认" onKeyUp={getInputValue}/>
            </div>
        </div>
    )
}
